<template>
	<div>
<!-- 	<div style="margin-top: 20px;width: 30%;height: 160px;background: #f8f8f8;float: left;line-height: 160px;font-size: 24px;font-weight: bold;text-align: center;margin-left: 3%;">
		工具在库：200
	</div>
	<div style="margin-top: 20px;width: 30%;height: 160px;background: #f8f8f8;float: left;line-height: 160px;font-size: 24px;font-weight: bold;text-align: center;margin-left: 3%;">
		工具已发放：200
	</div>
	<div style="margin-top: 20px;width: 30%;height: 160px;background: #f8f8f8;float: left;line-height: 160px;font-size: 24px;font-weight: bold;text-align: center;margin-left: 3%;">
		工具已清点：200
	</div>
   <div id="echarts" style="width: 90%;margin-left: 5%;; height:420px;float: left;margin-top: 40px;"></div> -->
		<img src="../api/1709733964344.jpg" />
   </div>
</template>
<script>
	
import { getTongjitu} from "@/api/foundation/indextu";
	
//import * as  echarts from 'echarts'
export default {
 data() {
  return {
	roleList: [],
	filters:{
		formatDateTime(value){
			return moment(value).format('YYYY/MM/DD HH:mm:ss')
		}
	},
   };
  },
  mounted() {
    //this.createEcharts();
  },
  methods: {
    createEcharts() {
      getTongjitu().then(response => {
		  this.roleList = response.data;
/* 		  for (var i = 0; i < response.data.length; i++) {
			  if(response.data[i].departmentName  == undefined){
				  response.data[i].departmentName = ' ';
			  }
			  if(response.data[i].count1  == undefined){
				response.data[i].count1 = ' ';
			  }
			  if(response.data[i].count2  == undefined){
				response.data[i].count2 = ' ';
			  }
			  if(response.data[i].count3  == undefined){
				response.data[i].count3 = ' ';
			  }
			  if(response.data[i].se1  == undefined){
				response.data[i].se1 = ' ';
			  }
			  var slwo = "";
			  if(response.data[i].se2  == undefined){
				 slwo = response.data[i].se2 = ' ';
			  }
			  this.roleList.push({
			  'departmentName':+response.data[i].departmentName
			  ,'count1':+response.data[i].count1
			  ,'count2':+response.data[i].count2
			  ,'count3':+response.data[i].count3
			  ,'se1':+response.data[i].se1
			  ,'se2':+ slwo
			  });
		  }
		   console.log(this.roleList)*/
        } 
      );
    },
dateFormat( str) {
  let date = new Date(str);
  let isV = this.isValidDate(date);
  if(!isV){
    let valSplit = str.split("/");
    return valSplit[2]+"-"+valSplit[1]+"-"+valSplit[0]
  }
  console.log(isV);
  let fmt = "YYYY-mm-dd HH:MM:SS";
  let ret;
  const opt = {
    "Y+": date.getFullYear().toString(),        // 年
    "m+": (date.getMonth() + 1).toString(),     // 月
    "d+": date.getDate().toString(),            // 日
    "H+": date.getHours().toString(),           // 时
    "M+": date.getMinutes().toString(),         // 分
    "S+": date.getSeconds().toString()          // 秒
    // 有其他格式化字符需求可以继续添加，必须转化成字符串
  };
  for (let k in opt) {
    ret = new RegExp("(" + k + ")").exec(fmt);
    if (ret) {
      fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
    };
  };
  return fmt;
},
// 判断是否可以转换为时间格式
isValidDate(date) {
  return date instanceof Date && !isNaN(date.getTime())
}


	  
  /*  createEcharts() {
        // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById("echarts"));
    // 绘制图表  
    // 最重要的就是理解各个配置的作用吧，这个没啥说的 就算熟能生巧
    myChart.setOption({
      legend: {},
      tooltip: {},
      dataset: {
          source: [
              ['工具状态', '入库', '已发放', '已清点'],
              ['Matcha Latte', 43.3, 85.8, 93.7],
              ['Milk Tea', 83.1, 73.4, 55.1],
              ['Cheese Cocoa', 86.4, 65.2, 82.5],
              ['Walnut Brownie', 72.4, 53.9, 39.1]
          ]
      },
      xAxis: {type: 'category'},
      yAxis: {},
      // Declare several bar series, each will be mapped
      // to a column of dataset.source by default.
      series: [
          {type: 'bar'},
          {type: 'bar'},
          {type: 'bar'}
      ]
    });
    } */
  }
};

</script>

<style scoped lang="scss">
td{
	    border: 1px solid #c9c9c9;
	padding: 20px;
}
.home {
  blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;
  }
  hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee;
  }
  .col-item {
    margin-bottom: 20px;
  }

  ul {
    padding: 0;
    margin: 0;
  }

  font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  color: #676a6c;
  overflow-x: hidden;

  ul {
    list-style-type: none;
  }

  h4 {
    margin-top: 0px;
  }

  h2 {
    margin-top: 10px;
    font-size: 26px;
    font-weight: 100;
  }

  p {
    margin-top: 10px;

    b {
      font-weight: 700;
    }
  }

  .update-log {
    ol {
      display: block;
      list-style-type: decimal;
      margin-block-start: 1em;
      margin-block-end: 1em;
      margin-inline-start: 0;
      margin-inline-end: 0;
      padding-inline-start: 40px;
    }
  }
}
</style>

